.productOptions {

  .optionActions {
    padding: 10px;
    background: var(--mall-store-background-color);
  }

  .optionName {
    @extend .optionActions;

    :global(.ant-form-item) {
      margin-bottom: 0;
    }

    :global(.ant-btn-link) {
      padding-left: 0;
      padding-right: 0;
    }
  }

  .optionValues {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 8px;
    margin-bottom: 8px;
  }

  .optionValueFormItem {
    width: 100%;
  }

  .optionValueInput {
    margin-bottom: 8px;
  }

  .optionValue {
    display: inline-flex;
    align-items: center;
    height: 2rem;
    border-radius: 3px;
    background-color: #dfe3e8;
    color: #212b36;
    margin-right: 8px;
    margin-bottom: 8px;
    padding: 0 12px;

    :global {
      .anticon {
        cursor: pointer;
        display: inline-flex;
        overflow: hidden;
        align-items: center;
        min-height: 2rem;
        min-width: 1rem;
      }

      .anticon-edit {
        margin-left: 12px;
      }

    }
  }
}
